﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>test border</title>
    <style type="text/css">
        p.none
        {
            border-style: none;
        }
        p.dotted
        {
            border-style: dotted;
            border-color: #2139A3;
        }
        p.dashed
        {
            border-style: dashed;
            border-width: thin;
            border-color: #0D8014;
        }
        p.solid
        {
            border-style: solid;
            border-width: thick;
        }
        p.double
        {
            border-style: double;
        }
        p.groove
        {
            border-style: groove;
        }
        p.ridge
        {
            border-style: ridge;
        }
        p.inset
        {
            border-style: inset;
        }
        p.outset
        {
            border-style: outset;
        }
        p.hidden
        {
            border-style: hidden;
        }
        p.shorthand
        {
            border: thick solid darkred;
            color: darkred;
            padding: 5px;
            text-align: center;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="common1.css" />
</head>
<body>
    <p class="none">
        No border.</p>
    <p class="dotted">
        A dotted border.</p>
    <p class="dashed">
        A dashed border.</p>
    <p class="solid">
        A solid border.</p>
    <p class="double">
        A double border.</p>
    <p class="groove">
        A groove border.</p>
    <p class="ridge">
        A ridge border.</p>
    <p class="inset">
        An inset border.</p>
    <p class="outset">
        An outset border.</p>
    <p class="hidden">
        A hidden border.</p>
    <p class="shorthand">
        styled by shorthand syntax</p>
    <hr />
    <div class="note">
        <h3>
            Note:</h3>
        <ul>
            <li>The "border-width" property does not work if it is used alone. Use the "border-style"
                property to set the borders first.</li>
            <li>The "border-color" property does not work if it is used alone. Use the "border-style"
                property to set the borders first.</li>
        </ul>
    </div>
</body>
</html>
